<style scoped>
    .pre-list-page{}

</style>
<template> 
    <div class="pre-list-page">
        <el-form :inline="true" :model="formInline" class="demo-form-inline" style="border-bottom:1px solid #ccc;">
            <el-form-item label="法人名称" class="selectMB10">
                <el-select size="mini" clearable  v-model="formInline.legalPersonName" placeholder="请选择" @change="changeLegalPerson">
                    <el-option v-for="(legalPerson,index) in legalPersonDropDown" :key="index" :label="legalPerson.legalPersonName" :value="legalPerson.id">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="预入库单号" class="selectMB10">
                <el-input size="mini" v-model="formInline.shipNoticeNo" placeholder="请输入预入库单号"></el-input>
            </el-form-item>
            <el-form-item label="制单日期" class="selectMB10">
                <el-date-picker type="date" size="mini" :editable="false" v-model="formInline.createStartTime" placeholder="请选择"  @change="changeCreateStartTime()"></el-date-picker> 至
                <el-date-picker type="date" size="mini" :editable="false" v-model="formInline.createEndTime" placeholder="请选择"@change="changeCreateEndTime()"></el-date-picker>
            </el-form-item>
            <el-form-item label="状态" class="selectMB10">
                <el-select size="mini" clearable v-model="formInline.shipStatus" placeholder="请选择">
                    <el-option label="保存" value="btnSave"></el-option>
                    <el-option label="提交" value="btnSubmit"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="供应商名称" class="selectMB10">
                <el-select size="mini" clearable  v-model="formInline.partnerCode" placeholder="请选择" prop="supplierName">
                    <el-option v-for="(vendor,index) in formInline.supplierDropdown" :key="index" :label="vendor.partnerName" :value="vendor.partnerCode"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="送货地（简称）" class="selectMB10" :label-width="labelWidth120">
                <el-input size="mini" v-model="formInline.shortName" placeholder="请输入送货地"></el-input>
            </el-form-item>
            <el-form-item class="selectMB10">
                <el-button class="bolder outsideBtnBS selectAll" :disabled="selectDisabled" size="mini" type="danger" @click="queryPreInventorySheet()">查询</el-button>
            </el-form-item>
        </el-form>
        <!-- 预入库单清单列表-->
        <label class="default-label">预入库单清单列表</label>
        <el-table :data="PreInventorySheetData" border style="width: 100%;" v-loading.body="loading">
            <el-table-column type="index" header-align="center" align="center" label="序"  width="40"></el-table-column>

            <el-table-column
                    label="操作"
                    header-align="center" align="center"
                    width="100">
                <template scope="scope">
                    <div class="operationItem bolder">
                        <router-link :to="{ path: 'CheckPreSheet', query: { shipNoticeNo: scope.row.shipNoticeNo}}" class="operationItem bolder">查看</router-link>
                    </div>
                    <!--根据状态判断修改按钮是否起作用-->
                    <div class="operationItem bolder disabled" v-if="scope.row.shipStatus=='btnSubmit' && powerFlag">修改</div>
                    <div class="operationItem bolder" v-else-if="scope.row.shipStatus=='btnSave' && powerFlag">
                        <router-link :to="{ path: 'UpdatePreSheet', query: { shipNoticeNo: scope.row.shipNoticeNo}}" class="operationItem bolder">修改</router-link>
                    </div>
                </template>
            </el-table-column>
            <el-table-column
                    prop="shipNoticeNo"
                    header-align="center"
                    label="预入库单号"
                    width="140" show-overflow-tooltip>
            </el-table-column>
            <el-table-column
                    prop="createTime"
                    header-align="center"
                    label="制单日期"
                    width="100" show-overflow-tooltip>
            </el-table-column>
            <el-table-column
                    prop="currQuantity"
                    header-align="center"
                    label="总数量"
                    width="120" show-overflow-tooltip>
            </el-table-column>
            <el-table-column
                    prop="shipStatusName"
                    header-align="center"
                    align="center"
                    label="状态"
                    width="100" show-overflow-tooltip>
            </el-table-column>
            <el-table-column
                    prop="shipNoticceUserName"
                    header-align="center"
                    label="制单人"
                    width="100" show-overflow-tooltip>
            </el-table-column>
            <el-table-column
                    prop="partnerCode"
                    header-align="center"
                    label="供应商编码"
                    width="100" show-overflow-tooltip>
            </el-table-column>
            <el-table-column
                    prop="partnerName"
                    header-align="center"
                    label="供应商名称"
                    width="100" show-overflow-tooltip>
            </el-table-column>
            <el-table-column
                    prop="shortName"
                    header-align="center"
                    label="送货地"
                    width="100" show-overflow-tooltip>
            </el-table-column>
            <el-table-column
                    prop="addressDetail"
                    header-align="center"
                    label="详细地址"
                    width="100" show-overflow-tooltip>
            </el-table-column>
            <el-table-column
                    prop="linkMan"
                    header-align="center"
                    label="联系人"
                    width="100" show-overflow-tooltip>
            </el-table-column>
            <el-table-column
                    prop="linkManMobile"
                    header-align="center"
                    label="联系电话"
                    width="100" show-overflow-tooltip>
            </el-table-column>
            <!--<el-table-column
                    prop="shipNoticeBak"
                    header-align="center"
                    label="备注"
                    width="100">
            </el-table-column>-->
        </el-table>

        <!--分页-->
        <el-pagination v-if="isPaging" @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="pageIndex"  :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :page-count="totalPage" :total="totalNumber"></el-pagination>

    </div>
</template>

<script>
       export default {
        data() {
            return {
                labelWidth:"80px",
                labelWidth120:"120px",
                // 查询表单
                formInline:{
                    legalPersonName:"",//法人名称
                    legalPersonCode:"",//法人编码
                    legalPersonId:"",//法人ID
                    shipNoticeNo:"",//预入库单号
                    createStartTime:"",//制单开始日期
                    createEndTime:"",//制单结束日期
                    shipStatus:"",//状态--保存和提交
                    partnerCode:"",//供应商信息
                    shortName:"",//送货地简称
                    supplierDropdown:[]
                },
                loading:false,
                //disabled:false,
                //模拟数据
                PreInventorySheetData:[],//预入库单清单列表
                legalPersonDropDown:[], //法人名称
                supplierNameDropDown:[], //供应商名称

                // 分页
                pageIndex:1,    //当前页（必传）
                pageSize :10,   //每页多少条
                totalNumber: 20,
                totalPage:2,
                isPaging:false,
                //权限
                powerFlag:false,
                //查询禁用
                selectDisabled:false
            };
        },
        computed:{
           powerData(){
               return this.$store.state.powerData;
           }
       },
       watch:{
           powerData(){
               var _this=this;
               for(var i=0;i<_this.powerData.length;i++){
                   if(_this.powerData[i]=="ROLE_security_preInventory_modify"){
                       //预入库清单修改权限
                       _this.powerFlag=true;
                   }
               }
           }
       },
       //进入页面立即运行此方法
       mounted: function () {
            var _this = this;
            _this.$store.commit('currentActive', 'PreInventorySheet');
            _this.legalPersonDropDownValue();//获取法人列表下拉框值
        //    //ajax前后查询按钮禁用
        //    $(".selectAll").ajaxStart(function(){
        //        _this.selectDisabled=true;
        //    });
        //    $(".selectAll").ajaxStop(function(){
        //        _this.selectDisabled=false;
        //    });
            _this.queryPreInventorySheet();    //预入库单清单列表表单查询
           //判断权限
           for(var i=0;i<_this.powerData.length;i++){
               if(_this.powerData[i]=="ROLE_security_preInventory_modify"){
                   //预入库清单修改权限
                   _this.powerFlag=true;
               }
           }
       },
        methods: {
            //法人名称下拉列表值
            legalPersonDropDownValue(){
                var _this = this;
                $.ajax({
                    type:'GET',
                    url:_this.procurement_service+"legalPerson/ofCurrentUser",
                    cache:false,
                    success:function(data){
                        if(data.success){
                            _this.legalPersonDropDown = data.data;
                        }else{
                            _this.common.errorTip(data.errorMessage);
                        }
                    }
                })
            },
            // 选择法人 取id
            changeLegalPerson(){
                var _this = this;
                for(var i=0;i<_this.legalPersonDropDown.length;i++){
                    if(_this.formInline.legalPersonName==_this.legalPersonDropDown[i].id){
                        _this.formInline.legalPersonCode=_this.legalPersonDropDown[i].legalPersonCode;//获取法人编码进行传参查询
                        _this.formInline.legalPersonId=_this.legalPersonDropDown[i].id;//获取id查询供应商列表
                    }
                }
                _this.dropdownValue();//获取供应商下拉列表值
            },
            //供应商下拉列表值
            dropdownValue(){
                var _this=this;
                $.ajax({
                    type:'GET',
                    url:_this.metadata_service+"partner/queryByLegalPerson?legalPersonId="+_this.formInline.legalPersonId,
                    cache:false,
                    success:function(data){
                        if(data.success){
                            _this.formInline.supplierDropdown=data.data;
                        }else{
                            _this.common.errorTip(data.errorMessage);
                        }
                    }
                })
            },
            //转换日期格式
            switchDate(myDate){
                return myDate.getFullYear()+"-"+(myDate.getMonth()+1)+"-"+myDate.getDate();
            },
            //只有改变日期参数时，才改变日期格式
            changeCreateStartTime(){
                var _this=this;
                if(_this.formInline.createStartTime!=""){

                }
                _this.formInline.createStartTime=_this.switchDate(_this.formInline.createStartTime);
            },
            changeCreateEndTime(){
                var _this=this;
                if(_this.formInline.createEndTime!=""){
                    _this.formInline.createEndTime=_this.switchDate(_this.formInline.createEndTime);
                }
            },
            //预入库单清单列表表单查询-----------------等待借口和所需参数查询
            queryPreInventorySheet(){
                var _this=this;
                _this.loading=true;
                var tmp={
                    legalPersonCode:_this.formInline.legalPersonCode,//法人编码
                    shipNoticeNo:_this.formInline.shipNoticeNo,//预入库单编号
                    createStartTime:_this.formInline.createStartTime,//制单日期(开始)
                    createEndTime:_this.formInline.createEndTime,  //制单日期(结束)
                    shipStatus:_this.formInline.shipStatus,  //状态（保存和提交）
                    partnerCode:_this.formInline.partnerCode,//供应商编码
                    shortName:_this.formInline.shortName,//送货地简称
                    pageIndex:_this.pageIndex,
                    pageSize:_this.pageSize
                };
                _this.selectDisabled=true;
                //console.log(JSON.stringify(tmp))
                //添加接口
                $.ajax({
                    type: 'POST',
                    url: _this.procurement_service+"shipPreNotice/findNoticeList",
                    cache: false,
                    data:JSON.stringify(tmp),
                    dataType:'JSON',
                    contentType: "application/json;charset=utf-8",
                    success: function (data) {
                        //console.log(data)
                        //加一层权限验证，如果返回error,则返回空
                        if(data.success){
                            //有权限
                            // if (data.success) {
                            _this.loading=false;
                            _this.isPaging=true;
                            _this.totalPage=data.data.totalPage;
                            _this.totalNumber=data.data.totalNumber;
                            _this.PreInventorySheetData=data.data.dataList;

                        }else{
                            //没有权限
                            _this.loading=false;
                            _this.common.errorTip(data.errorMessage)
                        }
                        _this.selectDisabled=false;
                    }
                });
            },
            //   分页
            handleSizeChange(val) {
                // console.log(`每页 ${val} 条`);
                var _this=this;
                _this.pageSize=val;
                _this.queryPreInventorySheet();

            },
            //点击页码分页查询点击事件
            handleCurrentChange(val) {
                // console.log(`当前页: ${val}`);
                var _this=this;
                _this.pageIndex=val;
                _this.queryPreInventorySheet();
            },

            // // ===================================
            // successTip(p) {     //成功时的提示信息
            //     this.$notify({
            //         title: '成功',
            //         message: p,
            //         type: 'success'
            //     });
            // },
            // errorTip(p) {     //错误提示
            //     this.$notify.error({
            //         title: '错误',
            //         message: p
            //     });
            // }

        }
    }
</script>

<style scoped>

</style>

